import { NodeSize } from '../config'

export default function stringCut(flow) {
  flow.register('StringCut', ({ PolygonNode, PolygonNodeModel, h }) => {
    class Node extends PolygonNode {
      getIconShape() {
        return h(
          'svg',
          {
            width: NodeSize,
            height: NodeSize,
            viewBox: '0 0 1024 1024'
          },
          h(
            'path',
            {
              fill: '#3D6480',
              d: 'M617.691429 646.89981h43.52v41.423238h-43.52zM537.35619 646.89981h43.52v41.423238H537.35619zM457.020952 646.89981h43.52v41.423238h-43.52zM858.697143 646.89981h43.52v41.423238H858.697143zM778.361905 646.89981h43.52v41.423238h-43.52zM698.026667 646.89981h43.52v41.423238H698.026667z'
            }
          ),
          h(
            'path',
            {
              fill: '#3D6480',
              d: 'M603.062857 316.806095l-40.764952 25.502476-224.621715 138.605715-59.245714-36.937143 9.118476-6.363429a105.569524 105.569524 0 1 0-165.766095-86.723047c0 41.081905 23.771429 76.848762 58.051048 94.305523l107.27619 66.80381L163.352381 589.141333a105.569524 105.569524 0 1 0 169.569524 83.943619 105.398857 105.398857 0 0 0-45.421715-86.747428l-9.142857-6.38781 59.196953-36.522666 101.814857 63.439238h100.571428l-151.893333-94.622476 168.448-102.863239 195.510857-122.416761c-21.74781-18.651429-82.895238-11.53219-148.943238 29.842285zM228.156952 407.478857a54.564571 54.564571 0 1 1 0-109.129143 54.564571 54.564571 0 0 1 0 109.129143z m54.540191 263.631238a54.54019 54.54019 0 1 1-109.104762 0 54.54019 54.54019 0 0 1 109.104762 0z'
            }
          )
        )
      }

      getLabelShape() {
        return h(
          'text',
          {
            fill: '#000000',
            fontSize: 12,
            x: NodeSize / 2,
            y: NodeSize + 20,
            textAnchor: 'middle',
            dominantBaseline: 'middle'
          },
          '剪切字符串'
        )
      }

      getShape() {
        const { x, y, width, height } = this.getAttributes()
        const transform = `matrix(1 0 0 1 ${x - width / 2} ${y - height / 2})`
        return h(
          'g',
          {
            transform
          },
          [
            h(
              'rect',
              {
                rx: 5,
                ry: 5,
                width: NodeSize,
                height: NodeSize,
                fill: '#fff',
                stroke: '#3D6380',
                strokeWidth: 1
              }
            ),
            this.getIconShape(),
            this.getLabelShape()
          ]
        )
      }
    }
    class Model extends PolygonNodeModel {
      constructor(data, graphModel) {
        super(data, graphModel)
        this.points = [
          [NodeSize / 2, 0],
          [NodeSize, NodeSize / 2],
          [NodeSize / 2, NodeSize],
          [0, NodeSize / 2]
        ]
      }
    }

    return {
      view: Node,
      model: Model
    }
  })
}
